<template>
	<view class="">
		<view class="leaner"></view>
         <view class="" style="height: 160rpx;"></view>
		<view class="group2 flex-col" @click="gomid">
			<view class="section1 flex-row justify-between">
				<view class="wrap3 flex-col justify-between">
					<view class="outer1 flex-row justify-between">
						<text class="info3">催单订单</text>
						<image class="icon1" src="../static/icon_324@2x.png" />
					</view>
					<text class="word3">Reminder&nbsp;order</text>
				</view>
				<image class="img1" src="../static/icon_325@2x.png" />
			</view>
		</view>
		
		<view class="group2 flex-col" @click="gomanage">
			<view class="section1 flex-row justify-between">
				<view class="wrap3 flex-col justify-between">
					<view class="outer1 flex-row justify-between">
						<text class="info3" style="width: 360rpx;">商品价格管理</text>
						<image class="icon1" src="../static/icon_324@2x.png" />
					</view>
					<text class="word3">Commodity&nbsp;price</text>
					<text class="word3" style="margin-top: 6rpx;">difference</text>
				</view>
				<image class="img1" style="width: 134rpx;height: 151rpx;"  src="../static/img_000001.png" />
			</view>
		</view>
		

		<view class="group2 flex-col" @click="gocode">
			<view class="section1 flex-row justify-between">
				<view class="wrap3 flex-col justify-between">
					<view class="outer1 flex-row justify-between">
						<text class="info3" style="width: 360rpx;">粉丝群二维码管理</text>
						<image class="icon1" src="../static/icon_324@2x.png" />
					</view>
					<text class="word3">Refund&nbsp;the&nbsp;difference</text>
				</view>
				<image class="img1" style="width: 134rpx;height: 151rpx;"  src="../static/icon_326@2x.png" />
			</view>
		</view>
		
	

		<u-tabbar :value="value" :fixed="true" :placeholder="true" activeColor="#109C7A">
			<block v-for="(item,index) in tabbar" :key='index'>
				<u-tabbar-item :text="item.name" @click="switchtab(item.url)">
					<image class="u-page__item__slot-icon" slot="active-icon" :src="item.checked_icon">
					</image>
					<image class="u-page__item__slot-icon" slot="inactive-icon" :src="item.no_checked_icon">
					</image>
				</u-tabbar-item>
			</block>
		</u-tabbar>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				value: 3,
				tabbar: [{
						name: '买手订单',
						checked_icon: '../static/cpm_tab-icon_5@2x.png',
						no_checked_icon: '../static/cpm_tab-icon_1@2x.png',
						url: '/P_service/buyer/list'
					},
					{
						name: '骑手订单',
						checked_icon: '../static/cpm_tab-icon_6@2x.png',
						no_checked_icon: '../static/cpm_tab-icon_2@2x.png',
						url: '/P_service/rider/list'
					},
					{
						name: '售后订单',
						checked_icon: '../static/cpm_tab-icon_7@2x.png',
						no_checked_icon: '../static/cpm_tab-icon_3@2x.png',
						url: '/P_service/aftersales/list'
					},
					{
						name: '其他',
						checked_icon: '../static/cpm_tab-icon_8@2x.png',
						no_checked_icon: '../static/cpm_tab-icon_4@2x.png',
						url: '/P_service/other/other'
					}
				]
			}
		},
		onLoad(e) {},
		onShow() {},
		methods: {
			switchtab(e) {
				uni.redirectTo({
					url: e
				})
			},
			gomid(){
				uni.navigateTo({
					url:"./reminder"
				})
			},
			gocode(){
				uni.navigateTo({
					url:"./code_manage"
				})
			},
			gomanage(){
				uni.navigateTo({
					url:"./price_manage"
				})
			},
		}
	}
</script>
<style>
	@import '../common.css';
</style>

<style>
	page{
		background: #F5F5F5;
	}
	.leaner {

		position: absolute;
		top: 0;
		height: 200rpx;
		width: 100%;
		background: linear-gradient(to bottom, #BCFAC8, transparent);

	}

	.group2 {
		box-shadow: 0px 0px 65rpx 0px rgba(188, 252, 200, 0.4);
		background-color: rgba(252, 255, 253, 1);
		border-radius: 30rpx;
		height: 260rpx;
		width: 630rpx;
		padding: 45rpx 10rpx 0 45rpx;
		position: relative;
		z-index: 3;
		box-sizing: border-box;
		margin-left: 60rpx;
		margin-top: 70rpx;
	}

	.section1 {
		/* width: 580rpx; */
		height: 140rpx;
	}

	.wrap3 {
		/* width: 242rpx; */
		height: 104rpx;
		margin-top: 34rpx;
	}

	.outer1 {
		width: auto;
		height: 40rpx;
	}

	.info3 {
		width: 160rpx;
		height: 40rpx;
		overflow-wrap: break-word;
		color: rgba(51, 51, 51, 1);
		font-size: 40rpx;
		font-family: MicrosoftYaHei-Bold;
		text-align: left;
		white-space: nowrap;
		line-height: 40rpx;
		font-weight: bold;
		display: block;
	}

	.icon1 {
		width: 33rpx;
		height: 10rpx;
		margin-top: 16rpx;
	}

	.word3 {
		width: 223rpx;
		overflow-wrap: break-word;
		color: rgba(102, 102, 102, 1);
		font-size: 30rpx;
		font-family: MicrosoftYaHei;
		text-align: left;
		white-space: nowrap;
		line-height: 30rpx;
		display: block;
		margin: 40rpx 0 0 2rpx;
	}

	.img1 {
		width: 202rpx;
		height: 140rpx;
		
	}
</style>
